<template>
  <div>
    <el-form :inline="true" :model="formInline" class="demo-form-inline">
      <el-form-item label="商品名称">
        <el-input v-model="formInline.gname" placeholder="商品名称"></el-input>
      </el-form-item>
      <el-form-item label="商品品牌">
        <el-input v-model="formInline.gbrand" placeholder="商品品牌"></el-input>
      </el-form-item>
      <el-form-item label="库存量">
        <el-input v-model="formInline.inventory" placeholder="库存量多少以下"></el-input>
      </el-form-item>
      <el-form-item label="最低价">
        <el-input v-model="formInline.minPrice" placeholder="最低价"></el-input>
      </el-form-item>
      <el-form-item label="最高价">
        <el-input v-model="formInline.maxPrice" placeholder="最高价"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">查询</el-button>
      </el-form-item>
    </el-form>


    <el-table
      :data="tableData"
      border
      style="width: 100%">
      <el-table-column
        fixed
        prop="iid"
        label="序号"
      >
      </el-table-column>
      <el-table-column
        prop="goods.gtype"
        label="商品类型"
      >

      </el-table-column>
      <el-table-column
        prop="goods.gbrand"
        label="商品品牌"
      >
      </el-table-column>
      <el-table-column
        prop="goods.gname"
        label="商品名称"
      >
      </el-table-column>
      <el-table-column
        prop="inventory"
        label="商品库存量"
      >
      </el-table-column>
      <el-table-column
        prop="shop.dname"
        label="店铺名称"
      >
      </el-table-column>
      <el-table-column
        prop="goods.gdesc"
        label="商品描述">
      </el-table-column>
      <el-table-column
        prop="minPrice"
        label="最低价">
      </el-table-column>
      <el-table-column
        prop="maxPrice"
        label="最高价">
      </el-table-column>
      <el-table-column
        prop="avgPrice"
        label="平均单价">
      </el-table-column>
      <el-table-column
        prop="sumPrice"
        label="库存总价">
      </el-table-column>
      <el-table-column
        prop="addTime"
        label="添加时间">
      </el-table-column>
      <el-table-column
        prop="updateTime"
        label="修改时间">
      </el-table-column>
      <el-table-column
        fixed="right"
        label="操作"
      >
        <template slot-scope="scope">
<!--          <el-button @click="handleClick(scope.row)" type="text" size="small">出库</el-button>
          <el-button type="text" size="small" @click="handleClick1(scope.row)" >入库</el-button>-->
          <el-button type="text" @click="openDe(scope.row,1)">出库</el-button>
          <el-button type="text" @click="openDe(scope.row,2)">入库</el-button>
        </template>
      </el-table-column>
    </el-table>

        <!--  弹出层  -->
      <el-dialog title="商品出入库" :visible.sync="dialogFormVisible" width="30%">
        <el-form :label-position="labelPosition" label-width="80px" :model="formIn">
          <el-form-item label="商品名称">
            <el-input v-model="formIn.gname" disabled/>
          </el-form-item>
          <el-form-item label="仓库名称">
            <el-input v-model="formIn.sName" disabled ></el-input>
          </el-form-item>
          <el-form-item label="数量">
            <el-input v-model="formIn.number" type="number" placeholder="输入数量" @blur="checks"></el-input>
          </el-form-item>
          <el-form-item label="单价">
            <el-input v-model="formIn.price" type="number"  step=".01" placeholder="输入单价" @blur="checks"></el-input>
          </el-form-item>
          <el-form-item label="总金额">
            <el-input v-model="formIn.sumPrice" type="number"  step=".01" disabled placeholder="自动计算"></el-input>
          </el-form-item>
          <el-form-item label="备注">
            <el-input v-model="formIn.remark"  placeholder="输入备注信息"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="submitDP">确认</el-button>
            <el-button @click="dialogFormVisible = false">返回</el-button>
          </el-form-item>
        </el-form>
  <!--      <div slot="footer" class="dialog-footer">
          <el-button @click="dialogFormVisible = false">取 消</el-button>
          <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
        </div>-->
      </el-dialog>
    <el-pagination
      background
      layout="prev, pager, next"
      :total="page.total"
      :page-size="2"
      @current-change="pageMethod"
    >
    </el-pagination>

  </div>

</template>

<script>
import qs from 'qs'
export default {
  name: "InventoryList",

  data(){

    return{
      page:{
        total:0
      },
      labelPosition: 'right',
      flag:'',
      //商品查询数据
      formInline: {
        gname: '',
        gbrand:'',
        inventory:'',
        minPrice:'',
        maxPrice:'',
      },
      //商品出人库数据
      formIn: {
        gname: '',
        sName:'',
        number:'',
        price:'',
        sumPrice:this.number+this.price,
        remark:'',
        sId:'',
      },
      //数据表格的数据
      tableData: []
      ,
      //弹出层的数据绑定等参数设置
      dialogFormVisible: false,
      formLabelWidth: '90px',


      toHouDuan:{
        goodsId:'',
        stash:'',
        amount:'',
        sumPrice:'',
        avgPrice:'',
        remark:'',
        sId:'',
      }

    }
  },
  mounted() {
    var vm = this
    this.axios({
      method:"GET",
      url:"/api/inventory/findAll?pageNum=1&pageSize=2"
    }).then(function (res){
      if(res.data.code == 200){
        vm.tableData = res.data.data.list
        vm.page.total = res.data.data.total
      }
    })

  },

  methods: {

    //提交出入库
    submitDP(){
      this.dialogFormVisible = false;
      this.toHouDuan.amount=this.formIn.number;
      this.toHouDuan.avgPrice=this.formIn.price;
      this.toHouDuan.sumPrice=this.formIn.sumPrice;
      this.toHouDuan.remark=this.formIn.remark;
      var vm=this;
      if (this.flag==1){
          this.axios.post("/api/inventory/delivery",qs.stringify(this.toHouDuan),
          ).then(function (res) {
            if (res.data.code==200){
              vm.$message({
                message: '出库成功',
                type: 'success'
              });
            }else{
              vm.$message({
                message: '出库失败',
                type: 'warning'
              });
            }

          });

      }else if (this.flag==2){
        this.axios({
          method:"POST",
          url:"/api/inventory/put",
          data:this.toHouDuan,

        }).then(function (res) {
          if (res.data.code==200){
            vm.$message({
              message: '入库成功',
              type: 'success'
            });
          }else{
            vm.$message({
              message: '入库失败',
              type: 'warning'
            });
          }

        });
      }



    },
    checks(){
      //if(this.formIn.number!=null||this.formIn.number!='')
      this.formIn.sumPrice=this.formIn.number*this.formIn.price;
    },
    //弹出层数据回显
    openDe(row,flag){
      this.flag=flag;
      this.dialogFormVisible = true;
      console.log(row)
      this.formIn.gname=row.goods.gname;
      this.formIn.sName=row.stash.sname;
      //清空之前的
      this.formIn.sumPrice='';
      this.formIn.number='';
      this.formIn.price='';
      this.formIn.remark='';
      //构造发送给后端的数据
      this.toHouDuan.stash=row.stashId;
      this.toHouDuan.goodsId=row.gid;
      this.toHouDuan.sId=row.sid;

    },
   /* handleClick1(row) {
      //console.log(row.iid);
      var iid=row.iid;
      this.$router.push({
        name:'Put',
        params:{
          iid:iid
        }
      });
    },*/

    onSubmit(){
      var vm = this;
      this.axios({
        method:"GET",
        url:"/api/inventory/findAll?gname="+vm.formInline.gname+"&inventory="+vm.formInline.inventory+"&gbrand="+
          vm.formInline.gbrand+"&minPrice="+ vm.formInline.minPrice+"&maxPrice="+ vm.formInline.maxPrice+"&pageNum=1&pageSize=2"
      }).then(function (res){
        if(res.data.code == 200){
          //console.log(res.data.data)
          vm.tableData = res.data.data.list
          vm.page.total = res.data.data.total

        }
      })

    },

    pageMethod(pageNum){
      var vm = this
      this.axios({
        method:"GET",
        url:"/api/inventory/findAll?gname="+vm.formInline.gname+"&inventory="+vm.formInline.inventory+"&gbrand="+
          vm.formInline.gbrand+"&minPrice="+ vm.formInline.minPrice+"&maxPrice="+ vm.formInline.maxPrice+"&pageNum="+pageNum+"&pageSize=2"
      }).then(function (res){
        if(res.data.code == 200){
          //console.log(res.data.data)
          vm.tableData = res.data.data.list
          vm.page.total = res.data.data.total

        }
      })


    }
  }
}
</script>

<style scoped>

</style>
